<!DOCTYPE html>
<head>
    <title>枣阳市第二人民医院管理系统--中软高科2015</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="Css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css" href="Css/bootstrap-responsive.css"/>
    <link rel="stylesheet" type="text/css" href="Css/style.css"/>
    <script type="text/javascript" src="Js/jquery.js"></script>
    <script type="text/javascript" src="Js/jquery.sorted.js"></script>
    <script type="text/javascript" src="Js/bootstrap.js"></script>
    <script type="text/javascript" src="Js/ckform.js"></script>
    <script type="text/javascript" src="Js/common.js"></script>
    <style type="text/css">
        body {
            padding-top: 40px;
            padding-bottom: 40px;
            background-color: #f5f5f5;
        }

        .form-signin {
            max-width: 300px;
            padding: 19px 29px 29px;
            margin: 0 auto 20px;
            background-color: #fff;
            border: 1px solid #e5e5e5;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
            -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
            box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        }

        .form-signin .form-signin-heading,
        .form-signin .checkbox {
            margin-bottom: 10px;
        }

        .form-signin input[type="text"],
        .form-signin input[type="password"] {
            font-size: 16px;
            height: auto;
            margin-bottom: 15px;
            padding: 7px 9px;
        }

    </style>
</head>
<body>
    <div class="container">
        <form id="from" class="form-signin" method="post" action="/user/login" onsubmit="return sub()">
            <h2 class="form-signin-heading" style="margin-left: 40px">&nbsp;&nbsp;&nbsp;登录系统</h2>
            <input id="no" type="text" name="loginName" class="input-block-level" placeholder="账号">
            <input id="pwd" type="password" name="passWord" class="input-block-level">
            <p><input id="verc" type="text" name="verify" class="input-medium" placeholder="验证码">
                <span id="vercode" style="padding: 10px;background-color: violet;cursor: pointer;color: white;"
                      onclick="verCode()"></span></p>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button id="btn" class="btn btn-large btn-primary"
                                                           style="margin-left: 80px" type="submit">登录
            </button>
            </p>
        </form>
    </div>
</body>
<script>
    $(function () {
        var vc = parseInt(Math.random() * (8999) + 1000);
        $("#vercode").html(vc);
        $("#pwd").attr("placeholder", "密码");

        $("#no").blur(function () {
            var no = $("#no").val();
            if (no == null || no === "") {
                $("#no").val("用户不能为空").css("color", "red");
                return false;
            }
        })
        $("#no").focus(function () {
            var no = $("#no").val();
            if (no === "用户不能为空") {
                $("#no").val("").css("color", "black");
            }
        })
        $("#pwd").blur(function () {
            var no = $("#pwd").val();
            if (no == null || no === "") {
                $("#pwd").attr("placeholder", "密码不能为空");
                return false;
            }
        })
        $("#pwd").focus(function () {
            if ($("#pwd").attr('placeholder') === "密码不能为空") {
                $("#pwd").attr("placeholder", "密码");
            }
        })
        $("#verc").blur(function () {
            var no = $("#verc").val();
            if (no == null || no === "") {
                $("#verc").val("验证码不能为空").css("color", "red");
            } else {
                if (parseInt($("#verc").val()) !== vc) {
                    alert('验证码错误');
                }
            }
        })
        $("#verc").focus(function () {
            var no = $("#verc").val();
            if (no === "验证码不能为空") {
                $("#verc").val("").css("color", "black");
            }
        })
    })

    function verCode() {
        var vc = parseInt(Math.random() * (8999) + 1000);
        $("#vercode").html(vc);
    }

    function sub() {
        if ($("#no").val() == null || $("#pwd").val() == null || $("#verc").val() == null
            || $("#no").val() == "" || $("#pwd").val() == "" || $("#verc").val() == "" ||
            $("#no").val() == "用户不能为空" || $("#pwd").val() == "密码不能为空" || $("#verc").val() == "验证码不能为空"
        ) {
            alert('请填写表单所有项');
            return false;
        } else {
            return true;
        }
    }
</script>
</html>